import TableLyout from '@/components/commonPublic/tableLyoutLong.vue'
import tree from "@/components/materialQualityPage/machineNetworkManage/tree"; //左侧机构树
import publicForm from "@/components/materialDataManage/fromCom.vue"; //弹框form
import elBreadcrumb from "@/components/public/el-breadcrumb.vue";
import lineEcharts from "@/components/materialQualityPage/machineNetworkManage/analysisDataManage/concreteQuality/lineEcharts.vue"; //折线图
import barEcharts from "@/components/materialQualityPage/machineNetworkManage/analysisDataManage/concreteQuality/barEcharts.vue"; //柱状图

import formJs from "./regexDetail.js"; //新增弹框配置
import {
    getTestHntQualityTrendsList, //列表页接口
    getBaseDataitemDetailByItemCode, //字典
    getUserCompanyTreeList, //树状图
} from "@/api/request.js";


export default {
    name: "concreteQuality",
    data() {
        return {
            name: "concreteQuality",
            searchObj: formJs.searchObj, //搜索条件
            loading: false,
            btnObj: [], //按钮
            tableData: {},//全部数据
            // 图表
            groupNmu: 0,
            getList: {
                MachineId: "",
                fCementtype: "",
                fCloseoperation: "",
                keyWord: "",
                modelType: "0",
                page: 1,
                pageSize: 20,

                fCompanyid: "", // 左侧选中组织机构id
                keyType: "", // 上方查询条件试验类型
                fAge: "",//上方查询条件龄期
                fStrength: "", //上方查询条件强度等级
                userId: "", //用户id
                startDates: "", //开始时间
                endDates: "", //结束时间
                timeDates: "",
                upNum: "",//波动上限
                downNum: "",//波动下限
                taskNumber: "",//区段
            },
            limitation: {
                title: "波动上下限",
                upperLimit: '1.5',
                upperText: "请输入上限",
                lowerLimit: '0.9',
                lowerText: "请输入下限"
            },
            lineChartList: [
                { con1: "类别", con2: "", con3: "", con4: "" },
                { con1: "组数", con2: "", con3: "", con4: "" },
                { con1: "占比(%)", con2: "", con3: "", con4: "" },
            ],
            // 折线图
            lineChartData: null,//折线图数据
            echartsTitle: "",//折线图标题
            xName: "时间",//X轴名称
            yName: "(MPa)",//Y轴名称
            // 折线图


            Histogram: {
                title: "区段",
                section: '0.9,1.0,1.15,1.25,1.5',
                sectionText: '可填多个，用英文","隔开',
            },
            histogramWidth: "",
            HistogramChartList: {},
            // 柱状图
            barChartData: null,//数据
            barChartTitle: "",//标题
            xBarName: "",//X轴名称
            yBarName: "组数",//Y轴名称
            // 柱状图
            // 图表

            // 机构树
            defaultProps: {
                children: "children",
                label: "fShortname",
            },
            treeText: {
                companyId: null,
                userId: null,
            },
            companyTree: "", //所有数据
            treeData: [], //左侧树状图数据
            highlightBd: true, //左侧机构树停留背景色
            treelength: false, //左侧树显示隐藏
            // checked: true, //查看下级按钮
            showName: "未选择公司",
            checkData: [], //树状图默认选中id
            // 机构树

        };
    },
    components: {
        TableLyout,
        publicForm,
        tree,
        elBreadcrumb,
        lineEcharts,
        barEcharts
    },
    mounted() {
        this.userInfo = JSON.parse(sessionStorage.getItem("yjSmart-userInfo"));

        this.lineChartList[0].con2 = "<" + this.limitation.lowerLimit + "倍组数";
        this.lineChartList[0].con3 = this.limitation.lowerLimit + "-" + this.limitation.upperLimit + "倍组数";
        this.lineChartList[0].con4 = ">" + this.limitation.upperLimit + "倍组数";

        this.getList = {
            MachineId: "",
            fCementtype: "",
            fCloseoperation: "",
            keyWord: "",
            modelType: "",
            page: 1,
            pageSize: 20,

            fCompanyid: "", //左侧选中组织机构id
            keyType: "抗压强度", //上方查询条件材料种类
            fAge: "", //上方查询条件龄期
            fStrength: "", //上方查询条件强度等级
            upNum: this.limitation.upperLimit,//波动上限
            downNum: this.limitation.lowerLimit,//波动下限
            taskNumber: this.Histogram.section,//区段
            userId: this.userInfo.userId, //查询待办或已办时传 列表页查询不传
            startDates: "", //进场开始时间
            endDates: "", //进场结束时间
            timeDates: [],
        };
        this.getStrengthgrade("StrengthGrade1");//强度
        this.getSpecimenage("SpecimenAge1");//龄期
        this.btnRole(this.name)

    },
    methods: {
        btnRole(name) {
            if (this.userInfo.userId != 'System') {
                var btnList = [];
                var ModuleList = JSON.parse(sessionStorage.getItem("yjSmart-ModuleList"));
                if (ModuleList.length > 0) {
                    ModuleList.map((item) => {
                        if (item.fEncode == name) {
                            btnList = item.modulebuttonList;
                        }
                    });
                    btnList.map(item => {
                        item['disabled'] = false
                    })
                    this.btnObj = btnList
                }
            } else {
                this.btnObj = formJs.btnObj
            }
        },
        getBtnName(name, status) {
            console.log(name, status);
        },
        // 左侧树结构
        getTree() {
            this.treeText = {
                companyId: this.userInfo.companyId,
                userId: this.userInfo.userId,
                // text: "1", // 0其他  1 砼拌合站 2水稳 3沥青
            };
            getUserCompanyTreeList(this.treeText)
                .then((res) => {
                    if (res.errcode == 0) {
                        var companyTree = res.data.userCompanyTreeList;
                        this.treeData = this.commonJs.tranListToTreeData(companyTree);
                        if (this.treeData[0].children == undefined) {
                            this.treelength = false; //左侧组织机构是否显示
                        } else {
                            this.treelength = true;
                        }
                        if (this.checkData[0]) {
                            this.showName = JSON.parse(
                                sessionStorage.getItem("yjSmart-machineNetworkManage_treeCheck")
                            ).fShortname;
                            this.getList.fCompanyid = this.checkData[0];
                        } else {
                            this.showName = this.treeData[0].fShortname; //当前点击组织机构名称
                            this.getList.fCompanyid = this.treeData[0].fCompanyid; //当前点击组织机构ID
                            this.checkData[0] = this.treeData[0].fCompanyid;
                        }

                        this.yj_searchForm(this.getList); // 调用主页面列表接口
                        // 列表
                    } else {
                        this.$message.error(res.msg);
                        return false;
                    }
                })
                .catch(() => {
                    return false;
                });
        },
        // 点击左侧机构树
        handleNodeClick(data) {
            this.showName = data.fShortname; //顶部显示机构名
            this.getList.fCompanyid = data.fCompanyid;
            this.yj_searchForm(this.getList);
        },

        // 图表
        clickInput(e) {
            this.limitation = e;
            this.lineChartList[0].con2 = "<" + this.limitation.lowerLimit + "倍组数";
            this.lineChartList[0].con3 = this.limitation.lowerLimit + "-" + this.limitation.upperLimit + "倍组数";
            this.lineChartList[0].con4 = ">" + this.limitation.upperLimit + "倍组数";
            this.getList.upNum = this.limitation.upperLimit;
            this.getList.downNum = this.limitation.lowerLimit;
            this.yj_searchForm(this.getList);
        },
        clickHistogram(e) {
            this.Histogram = e;
            this.getList.taskNumber = this.Histogram.section;
            this.yj_searchForm(this.getList);
        },
        // 图表

        // 获取列表数据
        yj_searchForm(data) {
            if (data.fAge == "龄期(天)") {
                data.fAge = "";
            }
            window.sessionStorage.setItem(
                "yjSmart-machineNetworkManage_getList",
                JSON.stringify(data)
            );


            var obj = {
                fCompanyid: data.fCompanyid, // 左侧选中组织机构id
                keyType: data.keyType, // 上方查询条件试验类型
                fAge: data.fAge, //上方查询条件龄期
                fStrength: data.fStrength, //上方查询条件强度等级
                userId: this.userInfo.userId, //用户id
                startDates: data.startDates, //开始时间
                endDates: data.endDates, //结束时间
                upNum: data.upNum,//波动上限
                downNum: data.downNum,//波动下限
                taskNumber: data.taskNumber,//区段
            }
            this.echartsTitle = "";
            this.barChartTitle = "";
            this.groupNmu = 0
            this.loading = true;
            getTestHntQualityTrendsList(obj)
                .then((res) => {
                    if (res.errcode == 0) {
                        var that = this;
                        that.loading = false;
                        that.echartsTitle = obj.startDates + "至" + obj.endDates + "【" + obj.fStrength + "】混凝土质量波动图（" + obj.keyType + ")";
                        that.barChartTitle = obj.startDates + "至" + obj.endDates + "【" + obj.fStrength + "】混凝土强度分布直方图（" + obj.keyType + ")";
                        that.tableData = res.data;

                        // 折线区域数据
                        that.lineChartData = {
                            xitems: [], //试验日期  X
                            yitems: [],//最大力强度  Y
                            fSamplenostr: [],//试件编号
                            fProjectlocation: [],//工程部位
                            downNum: [],//下限
                            upNum: [],//上限
                        }
                        if (res.data.HntQualityTrendsList.length != 0) {
                            that.groupNmu = res.data.HntQualityTrendsList.length;
                            res.data.HntQualityTrendsList.map(item => {
                                that.lineChartData.xitems.push(item.fTestdates);
                                that.lineChartData.yitems.push(item.fStrengthmeasurement);
                                that.lineChartData.fSamplenostr.push(item.fSamplenostr);
                                that.lineChartData.fProjectlocation.push(item.fProjectlocation);
                                that.lineChartData.downNum.push(item.downNum);
                                that.lineChartData.upNum.push(item.upNum);
                            })
                        }
                        that.lineChartList[1].con2 = res.data.downnum;
                        that.lineChartList[1].con3 = res.data.midnum;
                        that.lineChartList[1].con4 = res.data.upnum;
                        that.lineChartList[2].con2 = res.data.downnumPercent;
                        that.lineChartList[2].con3 = res.data.midnumPercent;
                        that.lineChartList[2].con4 = res.data.upnumPercent;

                        // 折线区域数据


                        //柱状图区域
                        var HistogramCharArr = [
                            { name1: "类别1", name2: "类别2", value: "组数", percent: "占比(%)" },
                        ];

                        var category = [];//类别
                        var category2 = [];//类别2  X
                        var groupNum = [];//组数  Y
                        var proportion = [];//占比(%)

                        HistogramCharArr.concat(res.data.itemslist).map(item => {
                            category.push(item.name1);
                            category2.push(item.name2);
                            groupNum.push(item.value);
                            proportion.push(item.percent);
                        });//柱状图数据
                        that.HistogramChartList = { category, groupNum, proportion };
                        that.histogramWidth = (100 / that.HistogramChartList.category.length) + "%";

                        var xitems = category2.slice(2, category2.length);
                        var yitems = groupNum.slice(2, groupNum.length);
                        that.barChartData = { xitems, yitems };
                        //柱状图区域

                    } else {
                        this.$message.error("列表数据获取失败", res.msg);
                        this.loading = false;
                    }
                })
                .catch((error) => {
                    console.log("列表数据 接口出错", error.msg);
                    this.loading = false;
                });
        },

        selectTime(e) {
            if (e[0] != "" && e[1] != "") {
                this.getList.startDates = e[0]; // 开始时间
                this.getList.endDates = e[1]; // 截至时间
            } else {
                this.getList.startDates = ""; // 开始时间
                this.getList.endDates = ""; // 截至时间
            }
            this.getList.timeDates = [e[0], e[1]]
            this.yj_searchForm(this.getList);

        },

        getDate() {
            if (JSON.parse(sessionStorage.getItem("yjSmart-machineNetworkManage_treeCheck"))) {
                var id = JSON.parse(sessionStorage.getItem("yjSmart-machineNetworkManage_treeCheck"));
                this.checkData = [id.fCompanyid];
            }
            if (JSON.parse(sessionStorage.getItem("yjSmart-machineNetworkManage_getList"))) {
                var getList = JSON.parse(sessionStorage.getItem("yjSmart-machineNetworkManage_getList"));
                this.getList.startDates = getList.startDates; // 开始时间
                this.getList.endDates = getList.endDates;  // 截至时间
                this.getList.timeDates = getList.timeDates;
            } else {
                this.getList.startDates = this.common.getDay(-6); // 开始时间
                this.getList.endDates = this.common.getDay(0); // 截至时间
                this.getList.timeDates = [this.getList.startDates, this.getList.endDates];
            }
            this.getTree();
        },

        // 字典项
        // 强度等级
        getStrengthgrade(data) {
            getBaseDataitemDetailByItemCode({ fItemcode: data })
                .then((res) => {
                    if (res.errcode == 0) {
                        this.searchObj[2].options = [];
                        res.data.baseDataitemdetailList.map((item) => {
                            this.searchObj[2].options.push({
                                value: item.fItemname,
                                label: item.fItemvalue,
                            });
                        });
                        this.getList.fStrength = this.searchObj[2].options[0].label;
                        this.getDate();

                    } else {
                        this.$message.error("强度等级", res.msg);
                    }
                })
                .catch(() => {
                    console.log("字典--强度等级接口报错");
                });
        },
        //试件龄期
        getSpecimenage(data) {
            getBaseDataitemDetailByItemCode({ fItemcode: data })
                .then((res) => {
                    if (res.errcode == 0) {
                        this.searchObj[3].options = [{
                            value: "龄期(天)",
                            label: "龄期(天)"
                        }];
                        res.data.baseDataitemdetailList.map((item) => {
                            this.searchObj[3].options.push({
                                value: item.fItemname,
                                label: item.fItemvalue,
                            });
                        });
                        this.getList.fAge = this.searchObj[3].options[0].label;

                    } else {
                        this.$message.error("试件龄期", res.msg);
                    }
                })
                .catch(() => {
                    console.log("字典--试件龄期接口报错");
                });
        },
        // 字典项



    },
};